﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@include file="/common/header.jsp"%>
<c:set var="path" value="../..${ctx}/user" />
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Pagination 分页表格</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<link href="${ctx}/demo/demo.css" rel="stylesheet" type="text/css" />

<script src="${ctx}/scripts/boot.js" type="text/javascript"></script>

<style type="text/css">
html,body {
	font-size: 12px;
	padding: 0;
	margin: 0;
	border: 0;
	height: 100%;
	overflow: hidden;
}
</style>
</head>
<body>

	<form id="form1" method="post">
		<input name="id" class="mini-hidden" />
		<div style="padding-left: 11px; padding-bottom: 5px;">
			<table style="table-layout: fixed;">
				<tr>
					<td style="width: 70px;">员工帐号：</td>
					<td style="width: 150px;"><input name="loginname"
						class="mini-textbox" required="true" emptyText="请输入帐号" /></td>
					<td style="width: 70px;">所属部门：</td>
					<td style="width: 150px;"><input name="dept_id"
						class="mini-combobox" valueField="id" textField="name"
						url="../data/AjaxService.jsp?method=GetDepartments"
						onvaluechanged="onDeptChanged" required="true" emptyText="请选择部门" />
					</td>
				</tr>
				<tr>
					<td>薪资待遇：</td>
					<td><input name="salary" class="mini-textbox" required="true" />
					</td>
					<td>职位：</td>
					<td><input name="position" class="mini-combobox"
						valueField="id" textField="name" /></td>
				</tr>

				<tr>
					<td>学历：</td>
					<td><input name="educational" class="mini-combobox"
						valueField="id" textField="name"
						url="../data/AjaxService.jsp?method=GetEducationals" /></td>
					<td>毕业院校：</td>
					<td><input name="school" class="mini-textbox" /></td>
				</tr>
			</table>
		</div>
		<fieldset style="border: solid 1px #aaa; padding: 3px;">
			<legend>基本信息</legend>
			<div style="padding: 5px;">
				<table>
					<tr>
						<td style="width: 70px;">姓名</td>
						<td style="width: 150px;"><input name="name"
							class="mini-textbox" required="true" /></td>
						<td style="width: 70px;">性别：</td>
						<td><select name="gender" class="mini-radiobuttonlist">
								<option value="1">男</option>
								<option value="2">女</option>
						</select></td>

					</tr>
					<tr>
						<td>年龄：</td>
						<td><input name="age" class="mini-spinner" value="25"
							minValue="1" maxValue="200" /></td>
						<td>出生日期：</td>
						<td><input name="birthday" class="mini-datepicker"
							required="true" emptyText="请选择日期" /></td>
					</tr>
					<tr>
						<td></td>
						<td><input name="married" class="mini-checkbox" text="已婚？"
							trueValue="1" falseValue="0" /></td>
						<td></td>
						<td></td>
					</tr>
					<tr>
						<td>国家：</td>
						<td><input name="country" class="mini-combobox"
							url="../data/countrys.txt" /></td>
						<td>城市：</td>
						<td><input name="city" class="mini-combobox" /></td>
					</tr>
					<tr>
						<td>备注：</td>
						<td colspan="3"><input name="remarks" class="mini-textarea"
							style="width: 350px;" /></td>
					</tr>
				</table>
			</div>
		</fieldset>
		<div style="text-align: center; padding: 10px;">
			<a class="mini-button" onclick="onOk"
				style="width: 60px; margin-right: 20px;">确定</a> <a
				class="mini-button" onclick="onCancel" style="width: 60px;">取消</a>
		</div>
	</form>
	<script type="text/javascript">
		mini.parse();

		var form = new mini.Form("form1");

		function SaveData() {
			var o = form.getData();

			form.validate();
			if (form.isValid() == false)
				return;

			var json = mini.encode([ o ]);
			$.ajax({
				url : "../data/AjaxService.jsp?method=SaveEmployees",
				type : 'post',
				data : {
					data : json
				},
				cache : false,
				success : function(text) {
					CloseWindow("save");
				},
				error : function(jqXHR, textStatus, errorThrown) {
					alert(jqXHR.responseText);
					CloseWindow();
				}
			});
		}

		////////////////////
		//标准方法接口定义
		function SetData(data) {
			if (data.action == "edit") {
				//跨页面传递的数据对象，克隆后才可以安全使用
				data = mini.clone(data);

				$.ajax({
					url : "../data/AjaxService.jsp?method=GetEmployee&id="
							+ data.id,
					cache : false,
					success : function(text) {
						var o = mini.decode(text);
						form.setData(o);
						form.setChanged(false);

						onDeptChanged();
						mini.getbyName("position").setValue(o.position);
					}
				});
			}
		}

		function GetData() {
			var o = form.getData();
			return o;
		}
		function CloseWindow(action) {
			if (action == "close" && form.isChanged()) {
				if (confirm("数据被修改了，是否先保存？")) {
					return false;
				}
			}
			if (window.CloseOwnerWindow)
				return window.CloseOwnerWindow(action);
			else
				window.close();
		}
		function onOk(e) {
			SaveData();
		}
		function onCancel(e) {
			CloseWindow("cancel");
		}
		//////////////////////////////////
		function onDeptChanged(e) {
			var deptCombo = mini.getbyName("dept_id");
			var positionCombo = mini.getbyName("position");
			var dept_id = deptCombo.getValue();

			positionCombo
					.load("../data/AjaxService.jsp?method=GetPositionsByDepartmenId&id="
							+ dept_id);
			positionCombo.setValue("");
		}
	</script>
</body>
</html>